<template>
    <div class="door-box">
        <heard @seachs="seachs"/> 
        <div @click="setSeachType">
            <slot></slot>
             <!-- <router-view v-slot="{ Component }">
    <keep-alive :include="state.includeList">
      <component :is="Component" /> 
    </keep-alive>
  </router-view> -->
            <!-- <router-view /> -->
        </div>
        <footers v-show="type"/> 
        
    </div>
</template>

<script setup lang="ts"> 
// @ts-nocheck
import { useProjectStore } from '@/store';
import heard from "@/components/heard/heard.vue"
import footers from "../footer/footer.vue"
import {useRoute} from "vue-router"
import {ref,watch,reactive} from "vue"

const store = useProjectStore();
const route=useRoute()
const state = reactive({
  includeList: [],
}); 
const type =ref(true)  
const seachType=ref(false)  
type.value=route.meta.isFooter

const setSeachType=()=>{
  
  store.setseachType()
}
watch(route,(newVal, oldVal)=>{  
    if (newVal.meta.keepAlive && state.includeList.indexOf(newVal.name) === -1) {
      state.includeList.push(newVal.name); 
      console.log(state.includeList,'触发keep'); 
    }
type.value=route.meta.isFooter

},{deep:true})

const seachs=()=>{
    seachType.value=!seachType.value
}
const closeSeach=()=>{
    seachType.value=false
}
</script>

<style lang="less" scoped>
.door-box{
     overflow: hidden;
    position: relative;
    width: 100%;
    min-height: 100vh;
}
</style>